<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/login.css">
    <script src="js/axios.min.js"></script>
    <script src="js/api.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.js"></script>
</head>

<body>
    <div class="box">
        <div class="top">
            <h3>密码登录</h3>
            <p>邮箱/手机<span>*</span></p>
            <input type="text">
            <!-- 提示信息 -->
            <p class="tip1">请输入正确的手机号码或者邮箱</p>

            <p>您的密码<span>*</span></p>
            <input type="text">
            <!-- 提示信息 -->
            <p class="tip2">请输入您的密码</p>
        </div>
        <div class="center">
            <div class="center-name"><input type="checkbox">记住用户名</div>
            <a href="index.html">忘记密码?</a>
        </div>
        <div class="bottom">
            <input type="button" value="登录" class="button">
            <input type="button" value="立即注册" class="button">
        </div>
        <p class="conten">使用合作网站账号登录</p>
        <div class="add">
            <div class="add-left"></div>
            <div class="add-right"></div>

        </div>
    </div>

    <script>
        let username = false;
        let password = false;
        //用户名
        $("input").eq(0).blur(function() {
                let res = /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
                if (res.test(this.value)) {
                    $(".tip1").css({
                        display: "none",
                        color: "#000"
                    })
                    username = true;
                } else {
                    $(".tip1").css({
                        display: "block",
                        color: "red"
                    })
                    username = false;
                }
            })
            //密码
        $("input").eq(1).blur(function() {
                let res = /^[a-zA-Z]\w{5,17}$/
                if (res.test(this.value)) {
                    $(".tip2").css({
                        display: "none",
                        color: "#000"
                    })
                    password = true;
                } else {
                    $(".tip2").css({
                        display: "block",
                        color: "red"
                    })
                    password = false;
                }
            })
            //登录按钮
        $(".button").eq(0).click(function() {
            let username = $("input").eq(0).val();
            let password = $("input").eq(1).val();
            if (username && password) {
                $.ajax({
                    url: loginAPI, // 必填，请求的地址
                    type: 'get', // 选填，请求方式，默认是 GET（忽略大小写）
                    data: {
                        username,
                        password
                    },
                    success(res) {
                        // console.log("123");
                        if (res.code == 1) {
                            location.href = "index.html";
                            console.log(res);
                            let uid = res.data.id;
                            let token = res.data.token;
                            localStorage.setItem("uid", uid)
                            localStorage.setItem("token", token)
                        } else {
                            alert(res.msg)
                        }
                        console.log(res);
                        // location.href = "login.html";
                    },
                })

                // location.href = "index.html"
            } else {
                // $(".tip1").css({
                //     display: "block",
                //     color: "red"
                // })
                // $(".tip2").css({
                //     display: "block",
                //     color: "red"
                // })
            }
        })
        $(".button").eq(1).click(function() {
            console.log("1233");
            location.href = "res.html"
        })
    </script>
</body>

</html>